<template>
  <div id="ass">
    <van-nav-bar
    :fixed="true"
      title="设置昵称"
      left-text="取消"
      right-text="保存"
      @click-left="onClickLeft"
      @click-right="onClickRight"
    />
    <van-cell-group>
      <van-field v-model="value" placeholder="请输入用户名" @input="val"/>
    </van-cell-group>
  </div>
</template>

<script>
  export default{
    name:'Editor',
    data(){
      return{
        value:'',
        list:''
      }
    },
    methods:{
       onClickLeft() {
            this.$router.go(-1)
          },
          onClickRight() {
             this.$toast('保存成功');
             localStorage.setItem('name',this.list)
          },
          val(){
            this.list=this.value;
            console.log(this.list)
          }
    }
  }
</script>

<style scoped="">
  .van-hairline--bottom{
    border-bottom:1px solid #DDDDDD ;
  }
  .van-nav-bar__text{
    font-size: 16px;
    color: #888888;
  }
  .van-nav-bar__title{
    font-size: 20px;
    font-weight: 600;
  }
  .van-cell{
    background: #fbfbfb;
    border-radius: 20px;
    color: #888888;
    caret-color: #fcdc01;
  }
  .van-cell-group{
    padding: 0 20px;

  }
</style>
